<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <!-- 主表单区域 -->
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="8" >
            <a-form-model-item label="成本价方案" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <j-ellipsis :value="model.name" :length="16"></j-ellipsis>
            </a-form-model-item>
          </a-col>
          <a-col :span="8" >
            <a-form-model-item label="物流渠道" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <j-ellipsis :value="model.channelName" :length="16"></j-ellipsis>
            </a-form-model-item>
          </a-col>
          <a-col :span="8" >
            <a-form-model-item label="报价币种" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <j-ellipsis :value="model.currencyType_dictText" :length="16"></j-ellipsis>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-table
          ref="table"
          size="middle"
          bordered
          rowKey="id"
          class="j-table-force-nowrap"
          :scroll="{x:true}"
          :columns="columns"
          :dataSource="dataSource"
          >
          <template slot="effectBeginTimeSlot" slot-scope="text, record">
            <div v-if="record.effectBeginTime">开始时间：{{ record.effectBeginTime }}</div>
            <div v-if="record.effectEndTime">结束时间：{{ record.effectEndTime }}</div>
          </template>
          <span slot="action" slot-scope="text, record">
            <template v-if="record.effectStatus === '1'">
              <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                <a>删除</a>
              </a-popconfirm>
              <a-divider type="vertical" />
              <a @click="handleEdit(record)">编辑</a>
              <a-divider type="vertical" />
            </template>
            <a @click="handleDetail(record)">查看详情</a>
          </span>
        </a-table>
      </a-form-model>
    </j-form-container>

    <!-- 变更报价 -->
    <logistics-change-quotation-modal ref="modalForm" @ok="modalFormOk" />
  </a-spin>
</template>

<script>
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import LogisticsChangeQuotationModal from './LogisticsChangeQuotationModal'
  export default {
    name: 'LogisticsHistoryQuotationForm',
    mixins: [JeecgListMixin],
    components: { LogisticsChangeQuotationModal },
    data() {
      return {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 8 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        model:{
          sourceType: 'config',
        },
        validatorRules: {
        },
        disableMixinCreated: true,
        url: {
          list: '/logistics/costPrice/logisticsCostPrice/queryVersionList',
          delete: "/logistics/costPrice/logisticsCostPrice/delete",
        },
        columns: [
          {
            title: '#',
            dataIndex: '',
            key:'rowIndex',
            width:60,
            align:"center",
            customRender:function (t,r,index) {
              return parseInt(index)+1;
            }
          },
          {
            title:'报价版本',
            align:"center",
            dataIndex: 'version'
          },
          {
            title:'生效时间',
            align:"center",
            dataIndex: 'effectBeginTime',
            scopedSlots: { customRender: 'effectBeginTimeSlot' },
          },
          {
            title:'创建时间',
            align:"center",
            dataIndex: 'createTime'
          },
          {
            title:'状态',
            align:"center",
            dataIndex: 'effectStatus_dictText'
          },
          {
            title:'操作人',
            align:"center",
            dataIndex: 'createBy'
          },
          {
            title: '操作',
            dataIndex: 'action',
            align:"center",
            width:147,
            scopedSlots: { customRender: 'action' },
          }
        ],
        dataSource: [],
        confirmLoading: false
      }
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    },
    created () {
       //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      add () {
        this.edit(this.modelDefault);
      },
      edit(record) {
        this.model = Object.assign({}, record);
        if (this.model.id) {
          this.queryParam = {
            code: this.model.code
          }
          //获取历史报价
          this.loadData();
        }
      },
      handleEdit(record){
        let curRecord = {...this.model, ...record};
        this.$refs.modalForm.edit(curRecord);
        this.$refs.modalForm.title = "编辑";
        this.$refs.modalForm.disableSubmit = false;
        // 从历史版本进入编辑页面不允许编辑生效时间
        this.$refs.modalForm.pageType = 'historyQuotation';
      },
      handleDetail(record){
        let curRecord = {...this.model, ...record};
        this.$refs.modalForm.edit(curRecord);
        this.$refs.modalForm.title="详情";
        this.$refs.modalForm.disableSubmit = true;
      }
    }
  }
</script>